
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<div id="app">
			<h1> web:{{name}},排名:{{index}},共有:{{num}}。</h1>
			<button v-on:click='changeName'>改变名称</button>
		</div>
	</body>
	<script src="vue.js"></script>
	<script>
		var myVue=new Vue({
			el:'#app',
			data:{
				name:"1906",
				index:2,
				num:22,
				list:[1,2,3]
			},
			//事件函数
			methods:{
				//改变name值
				//TODO:这里不理解
				changeName(){
					//获取name设置新值
					//this就是指当前的实例对象--vue实例
					this.name='前端1906A';
					this.input();
					//不可以自己调自己
				},
				input(){
					console.log("我是input事件")
				}
			}
		})
		console.log(myVue.name)
	</script>
</html>
